<template>
    <div class="blog-area blog-grid-page" style="padding-bottom: 0; padding-top: 100px">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-xl-8 col-lg-8">
                    <div class="section-title">
                        <h2>
                            <slot name="block"></slot>
                        </h2>
                    </div>
                </div>
            </div>
            <div class="row">
                <div v-for="item in 3" class="col-xl-4 col-lg-4 col-md-6" v-bind:key="item">
                    <div class="single-blog">
                        <div @click="toDetail">
                            <div class="part-img">
                                <!--<img :src="'/img/home/' + imgSrc" alt="">-->
                                <slot name="img"></slot>
                            </div>
                            <div class="part-text">
                                <slot name="title"></slot>
                                <slot name="content"></slot>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
  export default {
    name: "Block",
    components: {
    },
    data() {
      return {
      }
    },
    props: {
      detail: {
        type: Object
      },
      name: {
        type: String
      },
      id: {
        type: Number
      }
    },
    methods: {
      toDetail () {
        console.log(this.detail)
        this.$router.push({path: '/insurance_details', query: {detail: this.detail, name: this.name, id: this.id}})
      }
    }
  }
</script>

<style scoped>

</style>